<?php if (!defined('THINK_PATH')) exit();?>﻿<html>
<!DOCTYPE html>
<html lang="en" class="no-js">

    <head>

        <meta charset="utf-8">
        <title>签到</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">

        <!-- CSS -->
        <link rel="stylesheet" href="/qiandao/Public/css/reset.css">
        <link rel="stylesheet" href="/qiandao/Public/css/supersized.css">
        <link rel="stylesheet" href="/qiandao/Public/css/style.css">
		
		<style>
			.pic img{
				width:99px;
				height:99px;
				position:absolute;
				margin-top:25px;
				border-width:0px;
                border-radius: 50%;
                box-shadow: 0px 0px 5px #ffffff;
				//margin-left:-99px;
			}
			.pic input{
				width:100px;
				height:100px;
				opacity:0;
			}
            .submit_button{
                background:#212121 !important;
                border-color:#ffffff;
                width:50%;
            }


		</style>

        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->

    </head>

    <body>

        <div class="page-container">

            <form action="" method="post" id="signForm" enctype="multipart/form-data">
                <input type="text" name="username" class="username" placeholder="姓名">
                <input type=text" name="phone" class="phone" placeholder="手机号码！">
				<div class='pic'>
				    
				    <img src="/qiandao/Public/img/default.png" id="pic">
					<input type="file" id="file" name="pic" accept="image/*">
				</div>
                
                <button type="button" class="submit_button">签到</button>
                <div class="error"><span>+</span></div>
            </form>
            
        </div>
		
        <!-- Javascript -->
        <script src="/qiandao/Public/js/jquery-1.8.2.min.js" ></script>
        <script src="/qiandao/Public/js/supersized.3.2.7.min.js" ></script>
        <script src="/qiandao/Public/admin/js/common.js" ></script>

    </body>
	<script>



        jQuery(function($){
            document.getElementById("file").onchange = function(event){
                document.getElementById("pic").src = window.URL.createObjectURL(this.files[0]);
            };

            $(".submit_button").click(function(){
                if($(".username").val() == ''){
                    alert('姓名不能为空');
                }else if($(".phone").val() == ''){
                    alert('手机号码不能为空');
                }else if(!checkPhone($(".phone").val())){
                    alert('手机号码格式不正确');
                }else if($("#file")[0].files.length == 0){
                    console.log($("#file").val());
                    alert('照片不能为空');
                }else if(!checkImgType($("#file").val())){
                    alert('照片格式不正确');
                }else{
                    $("#signForm").submit();
                }
            });
            $.supersized({
                // 功能
                slide_interval     : 4000,    // 转换之间的长度
                transition         : 1,    // 0 - 无，1 - 淡入淡出，2 - 滑动顶，3 - 滑动向右，4 - 滑底，5 - 滑块向左，6 - 旋转木马右键，7 - 左旋转木马
                transition_speed   : 1000,    // 转型速度
                performance        : 1,    // 0 - 正常，1 - 混合速度/质量，2 - 更优的图像质量，三优的转换速度//（仅适用于火狐/ IE浏览器，而不是Webkit的）

                // 大小和位置
                min_width          : 0,    // 最小允许宽度（以像素为单位）
                min_height         : 0,    // 最小允许高度（以像素为单位）
                vertical_center    : 1,    // 垂直居中背景
                horizontal_center  : 1,    // 水平中心的背景
                fit_always         : 0,    // 图像绝不会超过浏览器的宽度或高度（忽略分钟。尺寸）
                fit_portrait       : 1,    // 纵向图像将不超过浏览器高度
                fit_landscape      : 0,    // 景观的图像将不超过宽度的浏览器

                // 组件
                slide_links        : 'blank',    // 个别环节为每张幻灯片（选项：假的，'民'，'名'，'空'）
                slides             : [    // 幻灯片影像
                    {image : '/qiandao/Public/img/1.jpg'},
                    {image : '/qiandao/Public/img/2.jpg'},
                    {image : '/qiandao/Public/img/3.jpg'}
                ]

            });

        });

	</script>

</html>